<template>
  <el-drawer :size="compontWidth" destroy-on-close v-model="compontOpen" direction="rtl">
    <template #header>
      <h4>{{ title }}</h4>
    </template>
    <template #default><slot name="content"></slot> </template>
    <template #footer>
      <div style="flex: auto">
        <el-button @click="cancelClick">关闭</el-button>
        <slot name="confirm"></slot>
      </div>
    </template>
  </el-drawer>
</template>
<script lang="ts" setup>
import { type IDrawerP } from "../index";
withDefaults(defineProps<IDrawerP>(), {
  title: "",
  compontWidth: 800
});
const compontOpen = ref(false);
function cancelClick() {
  compontOpen.value = false;
}
type IDrawEx = {
  compontOpen: Ref<boolean>;
};
let drawEx: IDrawEx = { compontOpen };
defineExpose({ ...drawEx });
</script>
